import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'

Vue.use(Vuex)

function getScalesByType(scaleType) {
    switch (scaleType) {
        case 'day':
            return [
                {unit: "month", step: 1, format: date => `${date.getFullYear()}年 ${date.getMonth() + 1}月`},
                {unit: "week", step: 1, format: date => `${gantt.date.getWeek(date)}周`},
                {unit: "day", step: 1, format: "%j"}
            ];
        case 'week':
            return [
                {unit: "year", step: 1, format: date => `${date.getFullYear()}年`},
                {unit: "month", step: 1, format: date => `${date.getFullYear()}年 ${date.getMonth() + 1}月`},
                {unit: "week", step: 1, format: date => `${gantt.date.getWeek(date)}周`}
            ];
        case 'month':
            return [
                {unit: "year", step: 1, format: date => `${date.getFullYear()}年`},
                {unit: "month", step: 1, format: date => `${date.getFullYear()}年 ${date.getMonth() + 1}月`}
            ];
        case 'year':
            return [
                {unit: "year", step: 1, format: date => `${date.getFullYear()}年`}
            ];
        default:
            return []; // 默认返回空数组
    }
}

export default new Vuex.Store({
    state: {
        taskId: null,
        isVisible: false,
        todoTaskCount: '',
        todoTaskCountModule: '',
        currentTask: {},
        ganttConfig: {
            xml_date: "%Y/%m/%d %H:%i:%s",
            row_height: 30,
            bar_height:30,
            show_markers: true,
            autosize: true,
            readonly: false,
            show_grid: true,
            locale: "zh",
            grid_width: "100%",
            scale_height: 60,
            currentScaleType: 'week',
            scales: getScalesByType('week'), // 初始化使用辅助函数
            min_column_width: 22,
            show_chart: false,
            show_progress: true,
            task_text_template: (start, end, task) => {
                let content = `<div>${task.statusName}</div>`
                return content;
            },
        },
        taskCompleted: false,
        activeTab: 'first',
        reminderCount: 0,
    },
    getters: {
        isVisible: state => state.isVisible,
        ganttConfig: state => state.ganttConfig,
        getActiveTab: state => state.activeTab,
    },
    mutations: {
        setIsVisible(state, isVisible) {
            state.isVisible = isVisible;
        },
        setTaskId(state, taskId) {
            state.taskId = taskId;
        },
        setTodoTaskCount(state, count) {
            state.todoTaskCount = count
        },
        setTodoTaskCountModule(state, details) {
            state.todoTaskCountModule = details
        },
        setCurrentTask(state, task) {
            Vue.set(state, 'currentTask', task);
        },
        setGanttConfig(state, config) {
            state.ganttConfig = {...state.ganttConfig, ...config};
        },
        RESET_CURRENT_TASK(state) {
            state.currentTask = {};
        },
        SET_CURRENT_SCALE_TYPE(state, scaleType) {
            state.ganttConfig.currentScaleType = scaleType;
            state.ganttConfig.scales = getScalesByType(scaleType);
        },
        SET_SCALE_CONFIG(state, scales) {
            state.ganttConfig.scales = scales;
        },
        setTaskCompleted(state, status) {
            state.taskCompleted = status;
        },
        setActiveTab(state, tab) {
            state.activeTab = tab;
        },
        setReminderCount(state, count) {
            state.reminderCount = count;
        }
    },
    actions: {
        fetchInitialData({dispatch}) {
            dispatch('fetchTodoCount');
        },
        fetchTodoCount({commit}) {
            axios.get('/task/todo/count').then(response => {
                console.log("我執行了fetchTodoCount")
                commit('setTodoTaskCount', response.data.data.total);
                commit('setTodoTaskCountModule', response.data.data.details)
            })
        },
        setIsVisible({commit}, isVisible) {
            commit('setIsVisible', isVisible);
        },
        updateCurrentTask({commit}, task) {
            commit('setCurrentTask', task);
        },
        updateGanttConfig({commit}, config) {
            commit('setGanttConfig', config);
        },
        refreshGanttScales({state}) {
            gantt.config.scales = state.ganttConfig.scales;
            gantt.render();
        },
        refreshGanttConfig({ state }) {
            const ganttConfig = state.ganttConfig;

            // 应用所有配置项
            gantt.config = { ...gantt.config, ...ganttConfig };

            // 设置语言环境
            gantt.i18n.setLocale(ganttConfig.locale);

            // 刷新甘特图以应用新配置
            gantt.render();

            console.log('甘特图配置已刷新');
        },
        resetGanttConfig({commit, dispatch}) {
            commit('SET_CURRENT_SCALE_TYPE', 'week'); // 重置为日视图
            dispatch('refreshGanttScales'); // 刷新甘特图以应用新的配置
        },
        zoomOut({commit, state, dispatch}) {
            let nextScaleType;
            switch (state.ganttConfig.currentScaleType) {
                case 'day':
                    nextScaleType = 'week';
                    break;
                case 'week':
                    nextScaleType = 'month';
                    break;
                case 'month':
                    nextScaleType = 'year';
                    break;
                case 'year':
                    console.log("已经是最粗略的视图");
                    return;
            }
            commit('SET_CURRENT_SCALE_TYPE', nextScaleType);
            dispatch('refreshGanttScales');
        },
        zoomIn({commit, state, dispatch}) {
            let prevScaleType;
            switch (state.ganttConfig.currentScaleType) {
                case 'year':
                    prevScaleType = 'month';
                    break;
                case 'month':
                    prevScaleType = 'week';
                    break;
                case 'week':
                    prevScaleType = 'day';
                    break;
                case 'day':
                    console.log("已经是最细的视图");
                    return;
            }
            commit('SET_CURRENT_SCALE_TYPE', prevScaleType);
            dispatch('refreshGanttScales');
        },
        updateActiveTab({commit}, tab) {
            commit('setActiveTab', tab);
        },
        fetchReminderCount({commit}) {
            axios.get('/reminder/count/').then(response => {
                console.log(response.data.data)
                commit('setReminderCount', response.data.data);
            })
        },
    }
});
